<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml"
   xmlns:xf="http://www.w3.org/2002/xforms"
   xmlns:ev="http://www.w3.org/2001/xml-events"
   xmlns:xbl="http://www.mozilla.org/xbl">
    <head>
    <style type="text/css">
#itemEntry .xf-value {
    width:250px;
    }
#content {
    border:inset 2px blue;
    width:350px;
    height:400px;
    overflow-y:auto;
    background: silver;
}
</style>
         <xf:model id="data_model">
             <xf:instance id="document_data" src="item-tree.xml" xmlns=""/>
             <xf:bind nodeset="//delete-trigger-enabled" relevant="count(//item) &gt; 1" />
             
             <xf:action ev:event="xforms-ready">
                  <xf:setfocus control="itemEntry" />
             </xf:action>
             
             <xf:action ev:event="addItemEvent">
                  <xf:insert nodeset="//data//item[position() =
index('list')]" at="index('list')" position="after" />
                  <xf:setvalue ref="//data//item[position() =
index('list')]" value="" />
                  <xf:setvalue ref="//data//item[position() =
                              index('list')]/@level" value="//data//item[position() =
                              index('list') - 1]/@level" />
                  <xf:setfocus control="itemEntry" />
             </xf:action>
             
             <xf:action ev:event="removeItemEvent">
                  <xf:delete nodeset="//data//item[position() =
index('list')]" at="index('list')" />
                  <xf:setindex repeat="list" index="index('list')-1" />
                  <xf:setfocus control="itemEntry" />
             </xf:action>
             
             <xf:action ev:event="promoteItemEvent">
                  <xf:setvalue ref="//data//item[position() =
index('list')]/@level" value="if(number(.) - 1 &lt; 1,1, number(.) - 1)" />
                  <xf:setfocus control="itemEntry" />
             </xf:action>
             
             <xf:action ev:event="demoteItemEvent">
                  <xf:setvalue ref="//data//item[position() =
index('list')]/@level" value="if(index('list') != 1,
                              if (number(.) &gt; //data//item[position() =
                              index('list')-1]/@level,(//data//item[position() =
                              index('list')-1]/@level) + 1,number(.) + 1),1)" />
                  <xf:setfocus control="itemEntry" />
             </xf:action>
             <xf:submission id="save" method="put" action="item-tree.xml" instance="document_data"/>
         </xf:model>
    </head>
    <body>
         <xf:group ref="/container/data">
             <div>
             
                  <xf:trigger id="addItem">
                      <xf:label>Add</xf:label>
                      <xf:action ev:event="DOMActivate">
                           <xf:dispatch name="addItemEvent" target="data_model" />
                      </xf:action>
                  </xf:trigger>
                  
                  <xf:trigger id="removeItem">
                      <xf:label>Remove</xf:label>
                      <xf:action ev:event="DOMActivate">
                           <xf:dispatch name="removeItemEvent" target="data_model" />
                      </xf:action>
                  </xf:trigger>
                  
                  <xf:trigger id="promote">
                      <xf:label>Promote &lt;</xf:label>
                      <xf:action ev:event="DOMActivate">
                           <xf:dispatch name="promoteItemEvent" target="data_model" />
                      </xf:action>
                  </xf:trigger>
                  <xf:trigger id="demote">
                      <xf:label>Demote &gt;</xf:label>
                      <xf:action ev:event="DOMActivate">
                           <xf:dispatch name="demoteItemEvent" target="data_model" />
                      </xf:action>
                  </xf:trigger>
                  <div id="content">
                      <xf:repeat nodeset="items/item" id="list">
                           <div>
                               <xf:input ref="." id="itemEntry" incremental="true">
                                    <xf:label>
                                        <xf:output value="concat(substring('&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;',
1, 3*(number(@level) - 1)),'* ')" />
                                    </xf:label>
                                    <xf:action ev:event="DOMActivate">
                                        <xf:dispatch name="addItemEvent" target="data_model" />
                                    </xf:action>
                               </xf:input>
                           </div>
                      </xf:repeat>
                  </div>
             </div>
         </xf:group>
         <xf:submit submission="save">
                  <xf:label>Save</xf:label>
             </xf:submit>
    </body>
</html>
